﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="wfVehicleInfo.aspx.cs" Inherits="msBsc.WebUi.wMall.Public.wfVehicleInfo" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>地接客车辆详情</title>
    <link href="/jqPlugin/SelectSimu/css/base.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/sLayout.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/sFoot.css" rel="stylesheet" />
    <%--chat--%>
    <link href="/themes/wStyle1/css/Chat/layim.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/carMessage.css" rel="stylesheet" />

    <style type="text/css">
        .vehicle-info-wrap {
            width: 1200px;
            margin: 0 auto;
            padding: 0;
        }

        .top-leader {
            height: 58px;
            border-bottom: 2px solid #f2f2f2;
            line-height: 58px;
            text-align: left;
            font-family: 微软雅黑;
            font-size: 14px;
            color: #999;
        }

            .top-leader a, .top-leader span {
                font-family: 微软雅黑;
                font-size: 14px;
                color: #999;
            }

            .top-leader span {
                color: #3398dc;
            }

        .leader-info {
            float: left;
        }

        .solder-info {
            float: right;
            margin-right: 0;
        }

        .vehicle-info {
            clear: both;
            width: 1200px;
            height: 420px;
            margin: 20px 0 40px 0;
        }

        .left-vehicle-pic, .vehicle-big-pic, .vehicle-big-pic img {
            width: 420px;
            max-height: 420px;
        }

        .left-vehicle-pic, .right-vehicle-content {
            float: left;
        }

        .right-vehicle-content {
            width: 715px;
            padding-left: 65px;
            text-align: left;
        }

        .vehicle-name {
            font-family: Adobe 黑体 Std;
            font-size: 28px;
            color: #333;
        }

        .vehicle-intro {
            font-family: 微软雅黑;
            font-size: 14px;
            line-height: 26px;
            color: #999;
        }

        .price-phone {
            width: 715px;
            height: 30px;
            padding: 20px 0;
            line-height: 30px;
            background-color: #f8f8f8;
            margin: 20px 0;
        }

        .price {
            font-family: Arial;
            font-size: 28px;
            color: #cc0000;
            padding-right: 120px;
            border-right: 1px solid #999;
            /*background: url(/themes/wStyle1/Images/Public/price_unit_01.jpg) no-repeat;*/
            background-position: 130px 5px;
        }

        .phone {
            font-family: Arial;
            font-size: 22px;
            padding-left: 60px;
            color: #666;
            background: url(/themes/wStyle1/Images/Public/icon_phone_02.jpg) no-repeat;
            background-position: 30px 0;
        }

        .vehicle-details {
            width: 715px;
            padding: 0;
            margin: 0;
            clear: both;
            font-family: 微软雅黑;
            font-size: 14px;
            color: #666;
            line-height: 30px;
        }

        .vehicle-intro {
            width: 715px;
            margin-top: 20px;
            max-height: 104px;
            overflow: hidden;
            height: 104px;
            overflow-y: scroll;
        }

        .nowtoorder {
            margin-top: 10px;
        }

            .nowtoorder a {
                width: 190px;
                height: 40px;
                text-align: center;
                font-family: Adobe 黑体 Std;
                font-size: 22px;
                color: #fff;
                font-weight: 600;
                line-height: 40px;
                background-color: #cc0000;
                display: block;
            }

        .buyshould-evlution {
            width: 1200px;
            border: 1px solid #e2e2e2;
            min-height: 460px;
            margin-bottom: 20px;
            clear: both;
        }

        .buyshould-evlution-title {
            width: 1200px;
            height: 60px;
            border-bottom: 1px solid #e2e2e2;
        }

        .title-buy-wrap, .title-evlution-wrap {
            width: 145px;
            height: 20px;
            text-align: center;
            float: left;
            line-height: 20px;
            font-family: Adobe 黑体 Std;
            font-size: 20px;
            padding: 20px 0;
            color: #666;
            cursor: pointer;
            border-top: 2px solid #fff;
        }

        .buy-item {
            width: 145px;
            display: block;
            border-right: 1px solid #e2e2e2;
        }

        .selectedIcon {
            background: url(/themes/wStyle1/Images/Public/icon_cur_01.jpg) no-repeat;
            border-top-color: #208ed9;
            background-position: 65px -4px;
        }

        .buyshould-evlution-content {
            width: 1200px;
            min-height: 400px;
        }

        .buy-conttent, .evlution-content {
            width: 1160px;
            min-height: 360px;
            padding: 20px;
            font-family: 微软雅黑;
            font-size: 14px;
            color: #666;
            word-break: break-all;
            text-indent: 28px;
            text-align: left;
            display: none;
        }

        .contentSel {
            display: block;
        }

        .evlution-content {
            height: 1000px;
        }

        .unitPic {
            vertical-align: middle;
        }

        .commenuListLeft {
            max-width: 120px;
            min-height: 140px;
            float: left;
            overflow: hidden;
        }

        #commentList {
            margin: 0;
            padding: 0;
        }

            #commentList li {
                clear: both;
            }

        .commenuListRight {
            width: 1000px;
            float: left;
        }

        .commentTime {
            text-align: right;
        }

        .userComment img {
            width: 80px;
            height: 80px;
            vertical-align: top;
            margin-bottom: 10px;
        }

        .userComment a {
            display: block;
            text-indent: 0;
        }
    </style>
</head>

<body>
    <input type="hidden" id="hidVehicleId" value="" />
    <input type="hidden" id="hidIndex" value="1" />
    <%=msBsc.WebUi.Code.QtHtmlGet.GetHeaderLoginInfo() %>
    <div class="vehicle-info-wrap">
        <div class="top-leader">
            <div class="leader-info">
                <a href="/">首页</a> > <a href="/wp_VehicleList.htm">包车旅游</a> > <a id="m_countryId">中国</a> > <a id="m_cityId">北京</a>  > <a id="m_destionId">全部</a> > <span id="leader-name"></span>
            </div>
            <div class="solder-info">
                <a href="#" id="solderLink"></a>
                <span onclick="javascrit:{GetTecentQQ()}" style="cursor:pointer;">
                    <img src="/themes/wStyle1/Images/Chat/contact.gif" />
                </span>
            </div>
        </div>

        <div class="vehicle-info">
            <div class="left-vehicle-pic">
                <div class="vehicle-big-pic">
                    <img src="#" alt="车辆图片" />
                </div>
            </div>
            <div class="right-vehicle-content">
                <div class="vehicle-name"></div>
                <%--<div class="vehicle-intro">
                    车辆简介车辆简介车辆简介车辆简介车辆简介车辆简介车辆简介车辆简介车辆简介车辆简介车辆简介
                </div>--%>
                <div class="price-phone">
                    <span class="price"><span class="price-num"></span></span>
                        <%--<img src="/themes/wStyle1/Images/Public/price_unit_01.jpg" class="unitPic" />
                    <span class="phone"></span>--%>
                </div>
                <div class="vehicle-details">
                    <div class="brand-seats">
                        <span class="v-brand"></span>|
                        <span class="v-seats"></span>
                    </div>
                    <div class="serviceType">
                        服务类型: <span class="v-serviceType"></span>
                    </div>
                    <div class="serviceArea">
                        服务范围: <span class="v-serviceArea"></span>
                    </div>
                    <div class="vehicle-intro">
                    </div>
                    <div class="nowtoorder">
                        <a href="javascript:;" onclick="javascript:{GetTecentQQ()}">立即联系</a>
                    </div>
                </div>
            </div>
        </div>

        <div class="buyshould-evlution">
            <div class="buyshould-evlution-title">
                <div class="title-buy-wrap selectedIcon">
                    <span class="buy-item">购买须知</span>
                </div>
                <div class="title-evlution-wrap">
                    <span class="evlution-item">服务评价</span>
                </div>
            </div>
            <div class="buyshould-evlution-content">
                <div class="buy-conttent contentSel">
                </div>
                <div class="evlution-content" id="commentMsg">
                </div>
                <xmp id="svc_list_temp" style="display: none">
                             <ul class="comment" id="commentList">
                                 {{#for(var i=0,len=d.rows.length;i < len;i++){ }}
                                    <li id="comment_{{d.rows[i].CUSTOMER_EVLUTION_ID}}" class='row-fluid commentList' isImg="{{d.rows[i].EVLUTION_HAS_PIC}}">
                                <div class='commenuListLeft'>
                                    <div class='userComment'>
                                                <img src='{{d.rows[i].CUSTOMER_DEFAULT_PIC}}' /><a>{{d.rows[i].CUSTOMER_NICK}}</a>
                                    </div>
                                </div>
                                <div class='commenuListRight'>
                                    <div class='row-fluid'>
                                                <div class='commentContents'>{{d.rows[i].EVLUTION_CONTENT}}</div>
                                    </div>
                                    <div class='row-fluid'>
                                                <div class='commentImg' id="imgs_{{d.rows[i].CUSTOMER_EVLUTION_ID}}">
                                                   
                                        </div>
                                    </div>
                                            <div class="tb-r-photo-viewer J_ViewStage" style="width: 400px; display:none">
                                        <div class="tb-r-photo-viewer-bar">
                                                    <a onclick="hideView(this);" class="J_Hide">
                                                <span class="tb-r-photo-icon tb-r-photo-icon-hide"></span>收起
                                            </a>
                                                    <a href="" class="J_Open" target="_blank">
                                                <span class="tb-r-photo-icon tb-r-photo-icon-open"></span>原图</a>
                                                    <a href="javascript:void(0)" onclick="rotateLeft('theimage_{{d.rows[i].CUSTOMER_EVLUTION_ID}}',90);" class="J_TurnLeft">
                                                        <span class="tb-r-photo-icon tb-r-photo-icon-turnleft"></span>向左转</a>
                                                    <a href="javascript:void(0)" onclick="rotateRight('theimage_{{d.rows[i].CUSTOMER_EVLUTION_ID}}',90);" class="J_TurnRight">
                                                        <span class="tb-r-photo-icon tb-r-photo-icon-turnright"></span>向右转</a>
                                        </div>
                                        <div class="J_StageMain tb-r-photo-stage-main">
                                            <div class="tb-r-photo-stage-imgbox J_Imgbox">
                                                        <img id="theimage_{{d.rows[i].CUSTOMER_EVLUTION_ID}}" src="" onload="resizeimg(this,this.width,this.height)"  />
                                            </div>
                                        </div>
                                    </div>
                                    <div class='row-fluid'>
                                                <div class='commentTime'>{{d.rows[i].EVLUTION_TIME}}</div>
                                    </div>
                                </div>
                            </li>
                                 {{#} }}
                                </ul>
                          </xmp>
            </div>
        </div>
    </div>
    <%=msBsc.WebUi.Code.QtHtmlGet.GetFloorHtml() %>

    <!--start JS引用-->
    <script src="/themes/wStyle1/js/Chat/lib.js"></script>
    <script src="/themes/wStyle1/js/Chat/layim.js"></script>

    <script src="/jqPlugin/js/jquery-1.8.3.min.js"></script>
    <script src="/jqPlugin/js/jBase.js"></script>
    <script src="/jqPlugin/js/jBPage.js"></script>

    <%--chat--%>
    <script src="/themes/wStyle1/js/comm/VerifyJs.js"></script>
    <script src="/jqPlugin/layer/layer.min.js"></script>
    <script src="/jqPlugin/js/laytpl.js"></script>
    <script src="/jqPlugin/SelectSimu/js/SelectSimu.js"></script>
    <script src="/themes/wStyle1/js/comm/jsLayout.js"></script>
    <script src="/themes/wStyle1/js/comm/jsPagination.js"></script>
    <script src="/themes/wStyle1/js/comm/commentmsg.js"></script>

    <script type="text/javascript">
        $(function () {
            $("#hidVehicleId").val(GetQueryStr("vehicleId"));

            $(".buyshould-evlution-title div").click(function () {
                $(this).addClass("selectedIcon").siblings().removeClass("selectedIcon");
                $(".buyshould-evlution-content > div").eq($(this).index()).addClass("contentSel").siblings().removeClass("contentSel");
            })

            InitVehicleInfo();

            $(".title-evlution-wrap").click(function () {
                getContentMsg();
            })
        })

        function InitVehicleInfo() {
            var parm = new jsonRow();
            parm = addNoAreStatistics(parm, "车辆详情", "w0005");
            parm.AddCell("vehicleId", $("#hidVehicleId").val());
            parm.AddCell("ACTION", "init");
            ajaxComm(parm);
        }

        function IniChat(uid, username, userface, friend, islogin) {
            if (islogin) {
                xxim.Initialization(uid, username, userface, friend);
                xxim.view();
                xxim.renode();
                xxim.getDates(0);
                xxim.event();
                xxim.layinit();
                $("#talkWith").attr("lg", islogin);
            }
            else {
                xxim.messageInitia(friend);
            }

        }

        function setVehicleInfo(data, isLogin) {
            //$("#headImg").attr("src", data.rows[0].CUSTOMER_DEFAULT_PIC + " 197x197img.jpg");
            $("#talkWith").attr("userface", data.rows[0].CUSTOMER_DEFAULT_PIC);

            //$("#djackName").text(data.rows[0].CUSTOMER_NICK);
            $("#talkWith").attr("username", data.rows[0].CUSTOMER_NICK);

            $("#solderLink").attr("href", "/wp_DjackVehicle.htm?djackId=" + data.rows[0].DJACK_ID);
            $("#solderLink").text(data.rows[0].CUSTOMER_NICK);

            $("#talkWith").attr("userid", data.rows[0].DJACK_ID);

            $("#receiverInfo").attr("userid", data.rows[0].DJACK_ID).attr("username", data.rows[0].CUSTOMER_NICK).attr("userface", data.rows[0].CUSTOMER_DEFAULT_PIC).attr("lg", isLogin);

            //if (data.rows[0].CUSTOMER_BASEINFO_GENDER == "M" || data.rows[0].CUSTOMER_BASEINFO_GENDER == "F") {
            //    var SexSrc = data.rows[0].CUSTOMER_BASEINFO_GENDER == "M" ? "/themes/wStyle1/Images/Public/man.png" : "/themes/wStyle1/Images/Public/woman.png";
            //    $("#sex").attr("src", SexSrc);
            //}
            //$("#userIntroduction").text(data.rows[0].CUSTOMER_BASEINFO_INTRO);
            //$("#area").text(data.rows[0].P_COUNTRY_NAME + " | " + data.rows[0].P_CITY_NAME + " | " + data.rows[0].P_DISTINATION_NAME);
            //var lable = data.rows[0].SERVICE_LABEL;
            //var arrLable = lable.split("|");
            //$("#userInfo .lable").remove();
            //if (!IsNull(arrLable)) {
            //    arrLable.sort();
            //    for (var i = 0; i < arrLable.length; i++) {
            //        if (arrLable[i] == "1") {
            //            $("#userInfo").append("<img class='lable' src='/themes/wStyle1/Images/Public/careful.png' />");
            //        } else if (arrLable[i] == "2") {
            //            $("#userInfo").append("<img class='lable' src='/themes/wStyle1/Images/Public/drawUp.png' />");
            //        } else if (arrLable[i] == "3") {
            //            $("#userInfo").append("<img class='lable' src='/themes/wStyle1/Images/Public/rouristGuide.png' />");
            //        } else if (arrLable[i] == "4") {
            //            $("#userInfo").append("<img class='lable' src='/themes/wStyle1/Images/Public/Guide.png' />");
            //        }
            //    }
            //}
            $("#m_countryId").attr("href", "wp_VehicleList.htm?countryId=" + data.rows[0].VEHICLE_COUNTRY);
            $("#m_countryId").text(data.rows[0].V_COUNTRY_NAME);
            $("#m_cityId").attr("href", "wp_VehicleList.htm?countryId=" + data.rows[0].VEHICLE_COUNTRY + "&cityId=" + data.rows[0].VEHICLE_CITY);
            $("#m_cityId").text(data.rows[0].V_CITY_NAME);
            $("#m_destionId").attr("href", "wp_VehicleList.htm?countryId=" + data.rows[0].VEHICLE_COUNTRY + "&cityId=" + data.rows[0].VEHICLE_CITY + "&destionId=" + data.rows[0].VEHICLE_DESTINATION);
            $("#m_destionId").text(data.rows[0].V_DISTINATION_NAME);
            $(".vehicle-big-pic img").attr("src", data.rows[0].VEHICLE_DEFAULT_PIC + " 420x420img.jpg");
            $("#leader-name").text(data.rows[0].VEHICLE_NAME);
            $(".vehicle-name").text(data.rows[0].VEHICLE_NAME);
            $(".v-brand").text(data.rows[0].VEHICLE_BRAND_NAME);
            $(".v-seats").text(data.rows[0].VEHICLE_SEATS + " 座");
            $(".v-serviceType").text(data.rows[0].VEHICLE_SERVICE_TYPE_NAME);
            $(".v-serviceArea").text(data.rows[0].VEHICLE_SERVICE_AREA);
            //$("#carNumber").text(data.rows[0].VEHICLE_CODE);
            $(".vehicle-intro").html(data.rows[0].VEHICLE_INTRO);
            $(".phone").text(data.rows[0].CUSTOMER_BASEINFO_MOBILE);

            $(".price-num").text("￥" + getNumber(data.rows[0].VEHICLE_PRICE_DAY));
            $(".buy-conttent").html(data.rows[0].ORDER_SHOULD_KNOW);
            //$(".nowtoorder a").attr("href", "/wb_AddOrder.htm?carid=" + data.rows[0].VEHICLE_INFO_ID)
        }

        //获取评论 数据
        function getContentMsg() {
            var opart = new jsonRow();
            opart.AddCell("vehicleId", $("#hidVehicleId").val());
            opart.AddCell("pageIndex", $("#hidIndex").val());
            opart.AddCell("ACTION", "getmsg");
            ajaxComm(opart);
        }
        //分页
        function goPage(Index) {
            pIndex = Index;
            getContentMsg();
        }
        //图片加载
        function loginImg() {
            $("#commentList").children("li").each(function (i, e) {
                if ($(e).attr("isImg") == "True") {
                    //绑定图片
                    var commentID = $(e).attr("id").replace("comment_", "");
                    var opart = new jsonRow();
                    opart.AddCell("evlutionid", commentID);
                    opart.AddCell("ACTION", "getimgs");
                    ajaxComm(opart);
                }
            });
        }
        //img
        function imgView(data, t) {
            var imgs = "";
            $(data.rows).each(function (i, e) {
                imgs += '<img src="' + e.EVLUTION_IMAGES_SOURCE + '" title="评论图片" />';
            });
            $("#imgs_" + t).html(imgs);
            //绑定点击事件
            $("#imgs_" + t).children('img').click(function () {
                var $showView = $(this).parent().parent().next();
                $showView.find(".J_Open").attr("href", $(this).attr("src"));

                $showView.show();
                $showView.find(".J_Open").html();
                $("#theimage_" + t).attr("src", $(this).attr("src"));
            });
        }
    </script>
    <script src="/themes/wStyle1/js/Chat/chatMessage.js"></script>
</body>
</html>
